<!--
    group: 发票管理
    name: 申请重开票
    url: /invoice/applyInvoiceReopen
-->
<template>
  <div>
    <div class="invoice_header">
      <h3><span class="icons"></span>申请重开</h3>
      <span class="surplus">年度剩余开票金额：{{ amountColumn.yearTotalMoney }}元</span>
    </div>

    <div class="main_content">
      <a-form-model :model="form" ref="ruleForm"
                    :label-col="labelCol" :wrapper-col="wrapperCol"
                    :rules="rules"
      >
        <h3>发票信息</h3>
        <a-form-model-item label="" :colon="false" prop="taxType">
          <a-radio-group v-model="form.taxType" @change="onInvoiceChange">
            <a-radio :value="1" v-if="invoiceColumns.isSpecial">增值税专用发票</a-radio>
            <a-radio :value="2" v-if="invoiceColumns.isUniversal">增值税普通发票</a-radio>
          </a-radio-group>
        </a-form-model-item>
        <a-form-model-item class="imgType" v-if="invoiceColumns.isVatType" label="增值税率" prop="vatIndex">
          <a-radio-group v-model="form.vatIndex">
            <template v-for="(item,index) in vatRates">
              <a-radio v-if="item.use" :key="index" :value="item.vatIndex">{{ item.value ? item.value + '%' : '' }}</a-radio>
            </template>
          </a-radio-group>
        </a-form-model-item>
        <a-divider dashed />
        <a-form-model-item label="" :colon="false" prop="taxMedium">
          <a-radio-group v-if="invoiceColumns.isSeparate" v-model="form.taxMedium" @change="onMediumChange">
            <a-radio :value="1" :disabled="invoiceColumns.isZzTicket">纸质发票</a-radio>
            <a-radio :value="2" :disabled="invoiceColumns.isZdTicket">电子发票</a-radio>
          </a-radio-group>
          <a-radio-group v-if="!invoiceColumns.isSeparate" v-model="form.taxMedium" @change="onMediumChange">
            <a-radio :value="1" :disabled="invoiceColumns.isPzTicket">纸质发票</a-radio>
            <a-radio :value="2" :disabled="invoiceColumns.isPdTicket">电子发票</a-radio>
          </a-radio-group>
        </a-form-model-item>
        <a-form-model-item class="imgType" v-if="invoiceColumns.isImageType" label="文件格式" prop="imageType">
          <a-radio-group v-model="form.imageType">
            <a-radio :value="'ofd'">OFD格式</a-radio>
            <a-radio :value="'pdf'">PDF格式</a-radio>
          </a-radio-group>
        </a-form-model-item>
        <a-divider />

        <!-------------------------------------------------------------  购买方信息 ↓   ------------------------------------------------------------>
        <h3>购买方信息</h3>
        <detail-list title="" :col="2" class="detail-layout">
          <detail-list-item>
            <a-form-model-item label="企业名称" required>{{ form.entName }}</a-form-model-item>
          </detail-list-item>
          <detail-list-item>
            <a-form-model-item label="税号" required>{{ form.entCreditCode }}</a-form-model-item>
          </detail-list-item>
          <detail-list-item>
            <a-form-model-item label="公司地址" prop="entAddress">
              <a-input v-model="form.entAddress" placeholder="收购方公司地址" />
            </a-form-model-item>
          </detail-list-item>
          <detail-list-item>
            <a-form-model-item label="电话" prop="entPhone">
              <a-input type="input" v-model="form.entPhone" placeholder="购买方公司电话" />
            </a-form-model-item>
          </detail-list-item>
          <detail-list-item>
            <a-form-model-item label="开户行" prop="entBankName">
              <a-input v-model="form.entBankName" placeholder="收票方公司开户行" />
            </a-form-model-item>
          </detail-list-item>
          <detail-list-item>
            <a-form-model-item label="账号" prop="entBankAccount">
              <a-input type="input" v-model="form.entBankAccount" placeholder="购买方公司银行账号" />
            </a-form-model-item>
          </detail-list-item>
        </detail-list>
        <a-divider />

        <!-------------------------------------------------------------  发票内容 ↓   ------------------------------------------------------------>
        <h3>发票内容</h3>
        <detail-list title="" :col="1" class="detail-layout two-layout">
          <detail-list-item>
            <a-form-model-item label="开票内容">
              <div v-for="item in form.taxContents">
                {{ item.invoiceTypeName }}
                <span class="mLeft">规格型号：{{ item.spec ? item.spec : '-' }}</span>
                <span class="mLeft">单位：{{ item.unit ? item.unit : '-' }}</span>
                <span class="mLeft">数量：{{ item.num }}</span>
                <span class="mLeft">单价：{{ item.unitPrice }}</span>
                <span class="mLeft">开票金额：{{ item.money }}元</span>
              </div>
            </a-form-model-item>
          </detail-list-item>
        </detail-list>
        <a-divider />

        <!-------------------------------------------------------------  发票方信息 ↓   ------------------------------------------------------------>
        <h3>销售方信息</h3>
        <detail-list title="" :col="2" class="detail-layout bill">
          <detail-list-item>
            <a-form-model-item label="发票抬头" required>
              {{ form.taxTitle }}
            </a-form-model-item>
          </detail-list-item>
          <detail-list-item>
            <a-form-model-item label="税号" required>
              {{ form.taxCreditCode }}
            </a-form-model-item>
          </detail-list-item>
          <detail-list-item>
            <a-form-model-item label="公司地址" prop="taxAddress">
              <a-input v-model="form.taxAddress" placeholder="请输入" />
            </a-form-model-item>
          </detail-list-item>
          <detail-list-item>
            <a-form-model-item label="开户行" prop="taxBankName">
              <a-input type="input" v-model="form.taxBankName" placeholder="请输入" />
            </a-form-model-item>
          </detail-list-item>
          <detail-list-item>
            <a-form-model-item label="电话" prop="taxPhone">
              <a-input v-model="form.taxPhone" placeholder="请输入" />
            </a-form-model-item>
          </detail-list-item>
          <detail-list-item>
            <a-form-model-item label="账号" prop="taxBankAccount">
              <a-input v-model="form.taxBankAccount" placeholder="请输入" />
            </a-form-model-item>
          </detail-list-item>
          <detail-list-item>
            <a-form-model-item label="收款人" prop="collectionUser">
              <a-input v-model="form.collectionUser" placeholder="收款人姓名" />
            </a-form-model-item>
          </detail-list-item>
          <detail-list-item>
            <a-form-model-item label="复核人" prop="reviewUser">
              <a-input v-model="form.reviewUser" type="input" placeholder="复核人姓名" />
            </a-form-model-item>
          </detail-list-item>
          <detail-list-item>
            <a-form-model-item label="开票人" prop="invoiceUser">
              <a-input v-model="form.invoiceUser" type="input" placeholder="开票人姓名" />
            </a-form-model-item>
          </detail-list-item>
        </detail-list>

        <h3>票面备注</h3>
        <a-textarea v-model="form.entRemark" placeholder="请不要超过90字（含数字、空格、标点）" :maxLength="90" :rows="4" allow-clear />
        <a-divider />

        <!-------------------------------------------------------------  业务说明 ↓   ------------------------------------------------------------>
        <h3>业务说明</h3>
        <detail-list title="" :col="1" class="detail-layout one-layout">
          <detail-list-item>
            <a-form-model-item label="业务结算周期">
              {{ form.bizSettleAccountsCycleStart }} —
              {{ form.bizSettleAccountsCycleEnd }}
            </a-form-model-item>
          </detail-list-item>
          <detail-list-item>
            <a-form-model-item label="服务内容">{{ form.serviceContent }}</a-form-model-item>
          </detail-list-item>
          <detail-list-item>
            <a-form-model-item label="需完成的项目">{{ form.project }}</a-form-model-item>
          </detail-list-item>
          <detail-list-item>
            <a-form-model-item label="验收标准">{{ form.acceptanceCriteria }}</a-form-model-item>
          </detail-list-item>
          <detail-list-item>
            <a-form-model-item label="完成情况">{{ form.completionStatus }}</a-form-model-item>
          </detail-list-item>
          <detail-list-item>
            <a-form-model-item label="结算数据说明">{{ form.dataDesc }}</a-form-model-item>
          </detail-list-item>
          <detail-list-item>
            <a-form-model-item label=" " :colon="false" :label-col="{ span: 6 }" :wrapper-col="{ span: 18 }">
              <template v-for="item in colorList">
                <!--receiptStatus 0 未上传 1 待审核 2 审核通过-->
                <span v-if="form.receiptStatus == item.key">
                  <a-icon
                    :key="item.key"
                    :type="item.type"
                    theme="twoTone"
                    :two-tone-color="item.colorType"
                  />
                  <span :style="'margin-left: 5px;color:' + item.colorType">{{ item.verifyDesc }}</span>
                </span>
              </template>
              <span v-if="form.receiptStatus == 4" style="margin-left: 10px;">拒绝原因：{{ form.receiptCause ? form.receiptCause : '-' }}</span>
              <div v-if="form.receiptStatus == 1 || form.receiptStatus == 4">
                <p-UpLoadFile ref="qyfzrxx_sign" :showHelp="true" v-model="form.businessInfo" :config="signConfig" :extendedFileVerification="extendedFileVerification" :customRequestEvent="PUpLoadFileCustomRequestEvent"/>
              </div>
            </a-form-model-item>
          </detail-list-item>
        </detail-list>
        <a-divider />

        <!-------------------------------------------------------------  发票邮寄信息 ↓   ------------------------------------------------------------>
        <template v-if="!invoiceColumns.isImageType">
          <div class="title_header">
            <h3>发票邮寄信息</h3>
            <a-select
              placeholder="请选择发票邮寄信息"
              style="width: 180px"
              @change="handleMailChange"
            >
              <a-select-option v-for="(item,index) in mailList" :key="index" :value="item.id" :mailData="item">{{item.mailUserName}}</a-select-option>
            </a-select>
          </div>
          <detail-list title="" :col="1" class="detail-layout one-layout">
            <detail-list-item>
              <a-form-model-item label="收件地址" prop="mailUserAddress">
                <a-input type="input" v-model="form.mailUserAddress" placeholder="请输入" />
              </a-form-model-item>
            </detail-list-item>
            <detail-list-item>
              <a-form-model-item label="收件人" prop="mailUserName">
                <a-input type="input" v-model="form.mailUserName" placeholder="请输入" />
              </a-form-model-item>
            </detail-list-item>
            <detail-list-item>
              <a-form-model-item label="手机号" prop="mailUserPhone">
                <a-input type="input" v-model="form.mailUserPhone" placeholder="请输入" />
              </a-form-model-item>
            </detail-list-item>
          </detail-list>
          <a-divider />
        </template>

        <h3>开票备注</h3>
        <p class="remarks">您本次所需的发票数量：{{ form.canReturnBillNum }}张， 若您对每张发票金额有要求，请在下方备注告知我们，若无特殊要求，我们将随机分配金额！</p>
        <a-textarea v-model="form.taxRemark" placeholder="" :rows="4" />

        <div class="main_footer">
          <a-button type="primary" class="btnsLarge" @click="referTo">提交</a-button>
        </div>
      </a-form-model>
    </div>

    <!-------------------------------------------------------------  选择发票领用数量弹层 ↓   -------------------------------------------------------------->
    <UageInsufficient
      :isUseShow="variousLayers.isCollecteShow"
      v-if="ticketMargin && form.taxType && form.taxMedium && form.billUseNum && isTicketShow"
      :ticketMargin="ticketMargin"
      :taxType="form.taxType"
      :taxMedium="form.taxMedium"
      :billUseNum="isTicketShow ? form.billUseNum : 0"
      @handleUseFather="handleUseFather"
    />

  </div>
</template>

<script>
import Vue from 'vue'
import {
  getEntMoneyInfo,getEntSvConf,getTaxConfig,getMonthBillSegment,
  getSendList,getReceiveList,getMailList,getTaxInvoiceDetails,
  saveTaxReopenInvoice
} from '@/api/invoiceAdminister'
import { conversionElement,percentConversion,conversionBranch,
  cloneObject,limitDigits } from '@/utils/util'
import UageInsufficient from '@views/invoice/common/usageInsufficient'  //发票领用
import DetailList from '@/components/tools/DetailList'
const DetailListItem = DetailList.Item
const getUploadConfig = () => {
  return {
    // 此参数必填  上传路径
    dir: "/qsb/invoice/",
    // 身份证  all   ；  单文件 对应 card1 ；   多文件 对应  card3 ； 身份证  对应  card1（身份证正面）、card2（身份证反面）
    model: "单文件",
    // 此参数选填   此属性只在 model= 身份证 时 启用   默认值文false
    showBG: false,
    // 此参数选填  表示是否可编辑
    readonly: false,
    // 提示信息
    tips:{
      card1: '上传流水回单',
    },
    // 此参数选填   文件上传必填校验 默认为false 不校验   当值为true时进行强制校验  需要配合【getDataCheckRes】方法使用；
    // 方法【getDataCheckRes】的具体用法如: this.$refs.UpLoadFile.getDataCheckRes({ card1: "请上传身份证正面",card2: "请上传身份证反面", card3: "请上传附件"});
    // 其中 【getDataCheckRes】的参数辨识检验不通过时对应的提示信息；card1、card2、card3均可缺省，也可选填对应的字段    此参数可空
    required: false,
    // 此参数选填   要回显的数据 card1 card2 的值的格式为：{name:'',url:''} ;  card3 的值的格式为 [{name:'',url:''}，{name:'',url:''}]
    defaultFileList: {
      card1: {},
    },
    // 此参数集必填
    fielConfig: {
      // 允许上传的文件类型 当为空时表示不限制  默认为空
      //    可供选择类型：
      //          图片('jpg', 'png', 'jpeg')
      //          文档('xlsx', 'xls', 'pptx', 'ppt', 'pdf', 'doc', 'docx', 'txt')
      //          压缩包('zip', 'rar')  发票('pdf', 'jpg', 'png', 'jpeg', 'doc', 'docx', 'zip', 'rar')
      //          PDF(pdf)
      //          委托代征协议('pdf','jpg', 'png', 'jpeg')
      //          我的任务('jpg', 'png', 'jpeg','pdf','xlsx', 'xls', 'pdf', 'doc', 'docx','zip', 'rar' )
      // eg:
      //    当值为string类型时，对所有（card1,card2,card3）的有效；
      //    当值为对象（{"card1":'图片',"card2":'文档', "card3":'PDF'}）时，可指定每个（card1/card2/card3）所对应的类型
      type: "发票",
      // 允许上传的文件个数  默认值为1
      // eg: 1 表示只允许上传1个文件；
      //      当值为对象（{"card1":1,"card2":2, "card3":3}）时，可指定每个（card1/card2/card3）所对应的类型
      size: 1,
      // 上传的单个文件大小 单位为 MB  默认值为1
      //  eg: 当值为 number 时，对所有（card1,card2,card3）的有效；
      //        当值为对象（{"pdf":5,"xlsx":10, "zip":100}）时,可指定对应的文件类型的大小（单位：MB）
      singleFileSize: 10,
    },
  }
}
export default {
  name: 'applyInvoiceReopen',
  components:{
    DetailList,
    DetailListItem,
    UageInsufficient
  },
  data(){
    return{
      labelCol: { span: 6 },
      wrapperCol: { span: 14 },
      //年季月开票金额与限制金额
      amountColumn: {
        yearTotalMoney: 0,  //年度剩余开票金额
        yearMoney: 0,  //年度开票金额
        quarterMoney: 0,  //当季开票金额
        quarterLimit: 0, //季度最大开票限额
        monthMoney: 0,  //当月开票金额
        monthLimit: 0, //当月最大开票限额
        yearLimit: 470000000,  //企业年度封顶金额470万元
      },
      //控制发票信息及上传文件的显隐
      invoiceColumns:{
        isSpecial: true,    //控制专票是否为可开票种
        isUniversal: true,  //控制普票是否为可开票种
        isSeparate: true,  //控制专普票下的纸质电子  true为专  false为普
        isZzTicket: false,  //专票纸质是否置灰
        isZdTicket: false,  //专票电子是否置灰
        isPzTicket: false,  //普票纸质是否置灰
        isPdTicket: false,  //普票电子是否置灰
        isVatType: false,    //控制增值税率
        isImageType: false,    //控制发票文件格式
      },
      isTicketShow: false,  //控制发票领用张数渲染
      ticketMargin: {
        invoiceSurplus: 0  //本次可选的发票数量
      },  //专普票下的纸质电子余量
      form: {
        taxType: null,  //2 普票 1 专票
        vatIndex: null,   //增值税率
        taxMedium: null,   //1 纸质 2 电子
        imageType: null,  //文件格式
        useSignature: false,  //电子签章

        entName: '',   //购买方信息---企业名称
        entCreditCode: '', //购买方信息---税号
        entAddress: '', //购买方信息---公司地址
        entPhone: '',  //购买方信息---电话
        entBankName: '',  //购买方信息---开户行
        entBankAccount: '',  //购买方信息---账号
        collectionUser: '', //购买方信息---收款人
        reviewUser: '', //购买方信息---复核人
        invoiceUser: '', //购买方信息---开票人

        taxBankName: '',  //发票方信息---开户行
        taxPhone: '',  //发票方信息---电话
        taxBankAccount: '',  //发票方信息---账号

        entRemark: '',  //票面备注

        time: [],  //业务说明-业务结算周期
        serviceContent: '',  //业务说明-服务内容
        project: '',  //业务说明-需完成的项目
        acceptanceCriteria: '',  //业务说明-验收标准
        completionStatus: '',  //业务说明-完成情况
        dataDesc: '',  //业务说明-结算数据说明

        mailUserAddress: '',   // 收件人-地址
        mailUserName: '',   // 收件人-姓名
        mailUserPhone: '',   //收件人-电话

        taxRemark: '',   //开票备注
        billUseNum: 0,   //开票数量
      },
      rules: {
        taxType:[{ required: true, message: '请选择发票种类', trigger: 'change' }],
        vatIndex: [{ required: false, message: '请选择增值税率', trigger: 'change' }],
        taxMedium:[{ required: true, message: '请选择发票类型', trigger: 'change' }],
        imageType: [{ required: false, message: '请选择发票格式', trigger: 'change' }],

        entAddress: [{ required: false, message: '请输入购买方公司地址', trigger: 'blur' }],
        entPhone: [
          { required: false, message: '请输入购买方公司电话', trigger: 'blur' },
          { validator: this.validatePhone1 }
        ],
        entBankName: [{ required: false, message: '请输入购买方公司开户行', trigger: 'blur' }],
        entBankAccount: [{ required: false, message: '请输入购买方公司银行账号', trigger: 'blur' }],
        collectionUser: [{ required: true, message: '请输入收款人', trigger: 'blur' }],
        reviewUser: [{ required: true, message: '请输入复核人', trigger: 'blur' }],
        invoiceUser: [{ required: true, message: '请输入开票人', trigger: 'blur' }],

        taxBankName: [{ required: false, message: '请输入销售方开户行', trigger: 'blur' }],
        taxPhone:[
          { required: false, message: '请输入销售方电话', trigger: 'blur' },
          { validator: this.validatePhone1 }
        ],
        taxAddress: [{ required: false, message: '请输入销售方公司地址', trigger: 'blur' }],
        taxBankAccount: [{ required: false, message: '请输入销售方账号', trigger: 'blur' }],

        mailUserAddress: [{ required: false, message: '请输入收件地址', trigger: 'blur' }],
        mailUserName: [{ required: false, message: '请输入收件人', trigger: 'blur' }],
        mailUserPhone: [
          { required: false, message: '请输入手机号', trigger: 'blur' },
          { validator: this.validatePhone1 }
        ],
      },
      extendedFileVerification:[{ groupName:'发票', suffixArr:['pdf', 'jpg', 'png', 'jpeg', 'doc', 'docx', 'zip', 'rar'],errorMsg:'只允许上传 PDF,JPG, PNG,JPEG,DOC,DOCX,ZIP,RAR 类型文件' }],
      //上传流水回单
      signConfig:getUploadConfig(),
      signConfig1: {
        dir:'/qsb/invoice/', // 上传文件的地址
        required: false, // 文件上传必填校验 默认为false 不校验   当值为true时进行强制校验
        showCardList: ['card1'],
        upLoadCardListConfig:[
          {type:'1',tips:'上传流水回单',fileInfo:{name:'',url:''}}
        ], // 此项最多可以传两组值 {type:'1',tips:'身份证人像面',backgroundPic:''},
        fielConfig:{
          type:'发票', // 允许上传的文件类型 当为空时表示不限制  默认为空   可供选择类型： 图片  文档  PDF  压缩包  发票
          size: 1, // 允许上传的文件个数  默认值为1
          singleFileSize: 10, //上传的单个文件大小 单位为 MB  默认值为1
        }
      },
      colorList: [
        {
          key: 4,
          type: 'close-circle',
          colorType: '#ff2b2b',
          verifyDesc: '审核拒绝'
        },
        {
          key: 3,
          type: 'check-circle',
          colorType: '#52c41a',
          verifyDesc: '审核通过'
        },
        {
          key: 2,
          type: 'clock-circle',
          colorType: '#ffac56',
          verifyDesc: '待审核'
        },
        {
          key: 1,
          type: 'info-circle',
          colorType: '#bbb',
          verifyDesc: '未上传'
        }
      ],

      vatRates: [],  // 选择增值税率
      receiverList: [],   //购买方列表
      partyList: [],   //发票方列表
      mailList: [],   //发票邮寄列表

      //控制各类弹层显示隐藏
      variousLayers:{
        isCollecteShow: false,   //发票领用弹层显隐
        invoiceVisible: false,   //未超限额弹层显隐
        isLimitShow: true,  //true预估费用    false提交成功
        exceedVisible: false,  //超限额
      },
      //发票领用数据
      billSegment:{},
    }
  },
  created() {
    this.id = this.$route.query.bizId;

    //detailsId 根据这个字段调取详情接口
    if (this.$route.query.detailsId){
      this.getListDetails(this.$route.query.detailsId);
    }
  },
  mounted() {
    this.getMoneyInfo();   //获取开票金额
    this.getMonthBillSegments();   //获取企业发票号段详细余量
    this.getMonthLimit();   //获取当前企业月度最大限额
    this.getTaxRequirements();   //获取匹配的税率要求

    this.getPartyList();   //获取发票方信息
    this.getDraweeList();   //获取购买方信息
    this.getReceivingList();   //查询收件信息
  },
  methods:{
    //判断普票,专票
    onInvoiceChange(e) {
      //普通 2  专用 1
      if (e.target.value == 2){
        this.invoiceColumns.isVatType = false;  //控制增值税率展示
        this.rules.vatIndex[0].required = false;
        this.invoiceColumns.isSeparate = false;  //控制纸质电子展示
        //判断普通发票必填项
        this.rules.entAddress[0].required = false;
        this.rules.entPhone[0].required = false;
        this.rules.entBankName[0].required = false;
        this.rules.entBankAccount[0].required = false;

        this.rules.taxBankName[0].required = false;  //销售方信息
        this.rules.taxAddress[0].required = false;
        this.rules.taxPhone[0].required = false;
        this.rules.taxBankAccount[0].required = false;
      }else{
        this.invoiceColumns.isVatType = true;
        this.rules.vatIndex[0].required = true;
        this.invoiceColumns.isSeparate = true;
        //判断专用发票必填项
        this.rules.entAddress[0].required = true;
        this.rules.entPhone[0].required = true;
        this.rules.entBankName[0].required = true;
        this.rules.entBankAccount[0].required = true;

        this.rules.taxBankName[0].required = true;  //销售方信息
        this.rules.taxAddress[0].required = true;
        this.rules.taxPhone[0].required = true;
        this.rules.taxBankAccount[0].required = true;
      }
    },
    //判断纸质，电子
    onMediumChange(e){
      // 1 纸质  2 电子
      if (e.target.value == 2){
        this.invoiceColumns.isImageType = true;
        this.rules.imageType[0].required = true;
        //判断电子发票必填项
        this.rules.mailUserAddress[0].required = false;
        this.rules.mailUserName[0].required = false;
        this.rules.mailUserPhone[0].required = false;
      }else{
        this.invoiceColumns.isImageType = false;
        this.rules.imageType[0].required = false;
        //判断纸质发票必填项
        this.rules.mailUserAddress[0].required = true;
        this.rules.mailUserName[0].required = true;
        this.rules.mailUserPhone[0].required = true;
      }
    },
    //  ------------------------------ 保存提交处理 ↓ -----------------------------
    //处理提交参数
    getParamData(){
      let data = cloneObject(this.form);
      data.entId = this.id;
      //判断增值税率与文件格式上传
      if (data.taxType == 2){
        Vue.delete(data,'vatIndex');   //普票不传增值税字段
      }
      if (data.taxMedium == 1){
        Vue.delete(data,'imageType');  //纸质不传发票格式
      }
      //处理开票内容
      for (const key in data.taxContents) {
        data.taxContents[key].money = conversionBranch(data.taxContents[key].money);
        data.taxContents[key].unitPrice = conversionBranch(data.taxContents[key].unitPrice);
      }
      //处理流水回单上传
      if (data.receiptStatus == 1 || data.receiptStatus == 4){
        // const res = this.$refs['qyfzrxx_sign'].getData();
        // if (res.length > 0){
        //   data.certificate = [{
        //     fileName: res[0].name,
        //     fileUrl: res[0].url
        //   }];
        // }
        if(!this.isType.isEmpty(this.form.businessInfo.card1.url)){
          data.certificate = [{
            fileName: this.form.businessInfo.card1.name,
            fileUrl: this.form.businessInfo.card1.url
          }];
        }
      }
      return data;
    },
    //提交
    referTo(){
      this.$refs.ruleForm.validate(valid => {
        if (valid){
          //本次开票数量 > 本次已领未用数量 + 本月发票剩余领用最大数量
          // true  提示：发票余量不足，请降低开票金额！
          // false  再判断进不进入发票领用弹层
          let invoiceSum;
          if (this.form.taxType == 1){
            if (this.form.taxMedium == 1){
              //专票纸质
              this.invoiceSum = this.ticketMargin.zz + this.ticketMargin.zzSurplusGet;
            }else{
              //专票电子
              this.invoiceSum = this.ticketMargin.zd + this.ticketMargin.zdSurplusGet;
            }
          }else{
            if (this.form.taxMedium == 1){
              //普票纸质
              this.invoiceSum = this.ticketMargin.pz + this.ticketMargin.pzSurplusGet;
            }else{
              //普票电子
              this.invoiceSum = this.ticketMargin.pd + this.ticketMargin.pdSurplusGet;
            }
          }
          this.isTicketShow = true;

          //本月开票数量 > 本企业总可开票数
          if (this.form.billUseNum > this.invoiceSum){
            this.$message.warning('发票余量不足，请降低开票金额！');
          }else{
            //判断该企业本次开票数量是否需要进行发票领用（根据 该企业选择的发票类型和票种查询该企业的最大限额）
            let collectionStatus = this.collectionLayer();
            //继续走是否超限额判定
            collectionStatus ? this.sureReferTo() : '';
          }
        } else {
          return false;
        }
      });
    },
    //确认提交
    sureReferTo(){
      //获取未超限额列表数据
      let params = this.getParamData();
      saveTaxReopenInvoice(params).then(res => {
        if (res.success) {
          //提交成功
          this.$message.success('提交成功');
          this.back();
        }else{
          this.$message.warning(res.message);
        }
      })
    },
    //返回列表
    back(){
      this.$router.push({
        path: '/invoice/invoiceQueryReopen'
      })
    },
    //  ---------------------------- 发票领用弹层相关操作 ↓ --------------------
    //判断是否调用发票领用弹层
    collectionLayer(){
      //是否展示弹层判断依据：   form.billUseNum 本次开票数量
      //   本次开票数量 > 该企业本次领用数量   true  继续走是否超限额判定
      if (this.form.taxType == 1){
        if (this.form.taxMedium == 1){
          //判断专票纸质的限额  zz,zzSurplusGet
          if (this.form.billUseNum - this.ticketMargin.zz > 0){
            this.variousLayers.isCollecteShow = true;
          }else{
            return true;
          }
        }else{
          //判断专票电子的限额  zd,zdSurplusGet
          if (this.form.billUseNum - this.ticketMargin.zd > 0){
            this.variousLayers.isCollecteShow = true;
          }else{
            return true;
          }
        }
      }else{
        if (this.form.taxMedium == 1){
          //判断普票纸质的限额  pz,pzSurplusGet
          if (this.form.billUseNum - this.ticketMargin.pz > 0){
            this.variousLayers.isCollecteShow = true;
          }else{
            return true;
          }
        }else{
          //判断普票电子的限额  pd,pdSurplusGet
          if (this.form.billUseNum - this.ticketMargin.pd > 0){
            this.variousLayers.isCollecteShow = true;
          }else{
            return true;
          }
        }
      }
    },
    //调用父组件  （下一步）
    handleUseFather(useData){
      //发票领用弹层隐藏，判断是否超限额
      this.form.billSegment = useData;
      this.variousLayers.isCollecteShow = false;
      this.isTicketShow = false;
      this.sureReferTo();
    },
    //领用弹层取消
    collecteCancle(){
      this.variousLayers.isCollecteShow = false;
      this.isTicketShow = false;
    },
    //  ---------------------------- 补充资料初始数据获取 ↓ --------------------------
    //查看详情
    getListDetails(id){
      getTaxInvoiceDetails(id).then(res => {
        if (res.success) {
          if (res.result){
            let data = cloneObject(res.result);
            // 删除领用对象
            Vue.delete(data,'billSegment');
            //发票邮寄信息
            data.mailUserAddress = data.invcMailReq.mailUserAddress;
            data.mailUserName = data.invcMailReq.mailUserName;
            data.mailUserPhone = data.invcMailReq.mailUserPhone;

            //处理开票金额
            for (const key in data.taxContents) {
              data.taxContents[key].money = conversionElement(data.taxContents[key].money);
              data.taxContents[key].unitPrice = conversionElement(data.taxContents[key].unitPrice);
            }
            this.form.taxContents = data.taxContents;
            this.form = data;

            //判断普票,专票 普通 2  专用 1
            if (this.form.taxType == 2){
              this.invoiceColumns.isSeparate = false;  //控制纸质电子展示
              this.invoiceColumns.isVatType = false;  //控制增值税率展示
              this.rules.vatIndex[0].required = false;
              //判断普通发票必填项
              this.rules.entAddress[0].required = false;
              this.rules.entPhone[0].required = false;
              this.rules.entBankName[0].required = false;
              this.rules.entBankAccount[0].required = false;

              this.rules.taxBankName[0].required = false;  //销售方信息
              this.rules.taxAddress[0].required = false;
              this.rules.taxPhone[0].required = false;
              this.rules.taxBankAccount[0].required = false;
            }else{
              this.invoiceColumns.isSeparate = true;
              this.invoiceColumns.isVatType = true;
              this.rules.vatIndex[0].required = true;
              //判断专用发票必填项
              this.rules.entAddress[0].required = true;
              this.rules.entPhone[0].required = true;
              this.rules.entBankName[0].required = true;
              this.rules.entBankAccount[0].required = true;

              this.rules.taxBankName[0].required = true;  //销售方信息
              this.rules.taxAddress[0].required = true;
              this.rules.taxPhone[0].required = true;
              this.rules.taxBankAccount[0].required = true;
            }
            //判断纸质电子限制邮寄信息是否为必填项
            if(this.form.taxMedium == 1){
              this.rules.mailUserAddress[0].required = true;
              this.rules.mailUserName[0].required = true;
              this.rules.mailUserPhone[0].required = true;
              this.invoiceColumns.isImageType = false;  //电子发票展示发票格式选择
            }else{
              this.rules.mailUserAddress[0].required = false;
              this.rules.mailUserName[0].required = false;
              this.rules.mailUserPhone[0].required = false;
              this.invoiceColumns.isImageType = true;  //电子发票展示发票格式选择
            }

            //业务说明时间
            this.form.time = [this.form.bizSettleAccountsCycleStart,this.form.bizSettleAccountsCycleEnd];
            //流水回单文件回显
            if (this.form.certificate && this.form.certificate.length > 0){
              this.signConfig.upLoadCardListConfig[0].fileInfo.url = this.form.certificate[0].fileUrl;
            }
          }
        }else{
          this.$message.warning(res.message);
        }
      })
    },
    //  ---------------------------- 获取限制金额和最大金额 ↓ --------------------
    //获取开票金额
    getMoneyInfo(){
      let entId = this.id;
      getEntMoneyInfo(entId).then(res => {
        if (res.success) {
          let data = res.result;
          if (data){
            let dataNew = cloneObject(data);
            this.amountColumn.yearTotalMoney = conversionElement(dataNew.yearBalanceMoney); //年度剩余开票金额
            this.amountColumn.yearMoney = dataNew.yearMoney;  //年度开票金额
            this.amountColumn.quarterMoney = dataNew.quarterMoney;  //当季开票金额
            this.amountColumn.quarterLimit = dataNew.quarterMoneyLimit;  //季度最大开票限额
            this.amountColumn.monthMoney = dataNew.monthMoney;  //当月开票金额
          }
        }else{
          this.$message.warning(res.message);
        }
      })
    },
    //获取当前企业服务模式下的月度最大限额
    getMonthLimit(){
      let entId = this.id;
      getEntSvConf(entId).then(res => {
        if (res.success) {
          if (res.result){
            let data = res.result.invoiceMax || 0;
            this.amountColumn.monthLimit = data;
          }
        }else{
          this.$message.warning(res.message);
        }
      })
    },
    //  ---------------------------- 获取税率配置及发票余量 ↓ --------------------
    //获取企业发票号段详细余量
    getMonthBillSegments(){
      let entId = this.id;
      getMonthBillSegment(entId,'').then(res => {
        if (res.success) {
          if (res.result){
            //处理余票最大限量
            // 例： zz代表该企业本次领取的数量    zzSurplusGet 代表该企业本月最大限额的剩余数量
            this.ticketMargin = res.result;
            //1、 判断专票下的纸质余量  zz,zzSurplusGet
            this.ticketMargin.zzSurplusGet <= 0 && this.ticketMargin.zz <= 0 ? this.invoiceColumns.isZzTicket = true : this.invoiceColumns.isZzTicket = false;
            //2、 判断专票下的电子余量  zd,zdSurplusGet
            this.ticketMargin.zdSurplusGet <= 0 && this.ticketMargin.zd <= 0 ? this.invoiceColumns.isZdTicket = true : this.invoiceColumns.isZdTicket = false;
            //3、 判断普票下的纸质余量  pz,pzSurplusGet
            this.ticketMargin.pzSurplusGet <= 0 && this.ticketMargin.pz <= 0 ? this.invoiceColumns.isPzTicket = true : this.invoiceColumns.isPzTicket = false;
            //4、 判断普票下的电子余量  pd,pdSurplusGet
            this.ticketMargin.pdSurplusGet <= 0 && this.ticketMargin.pd <= 0 ? this.invoiceColumns.isPdTicket = true : this.invoiceColumns.isPdTicket = false;
          }
        }else{
          this.$message.warning(res.message);
        }
      })
    },
    //获取匹配的税率要求
    getTaxRequirements(){
      let params = {};
      params.entId = this.id;
      getTaxConfig(params).then(res => {
        if (res.success) {
          if (res.result){
            let data = cloneObject(res.result);
            this.approvalMethod = res.result.approvalMethod;  //获取核定征收方式
            //判断该企业是否有开专普票的资格
            data[1] ? this.invoiceColumns.isSpecial = true : this.invoiceColumns.isSpecial = false;  //专票
            data[2] ? this.invoiceColumns.isUniversal = true : this.invoiceColumns.isUniversal = false;  //普票
            //处理增值税率
            if (data && res.result.vatRate_1 && res.result.vatRate_1.length > 0){
              let vatRates = res.result.vatRate_1;
              for (let k in vatRates) {
                vatRates[k].value = percentConversion(vatRates[k].value);
              }
              this.vatRates = vatRates;
            }
          }
        }else{
          this.$message.warning(res.message);
        }
      })
    },
    //  ---------------------------- 下拉框信息获取选择 ↓ --------------------------
    //获取发票方信息
    getPartyList(){
      let entId = this.id;
      getSendList(entId).then(res => {
        if (res.success) {
          if (res.result){
            this.partyList = res.result;

            //判断详情回显不展示默认值
            if (this.$route.query.detailsId){

            }else{
              if (res.result.length > 0){
                this.form.taxTitle = res.result[0].taxTitle;
                this.form.taxCreditCode = res.result[0].taxCreditCode;
                this.form.taxAddress = res.result[0].taxAddress;
                this.form.taxBankName = res.result[0].taxBankName;  //开户行
                this.form.taxPhone = res.result[0].taxPhone;  //电话
                this.form.taxBankAccount = res.result[0].taxBankAccount;  //账号

                if (res.result[0].entDetail){
                  let juridicalDate = res.result[0].entDetail;
                  this.form.collectionUser = juridicalDate.legalName;  //收款人
                  this.form.reviewUser = juridicalDate.legalName;  //复核人
                  this.form.invoiceUser = juridicalDate.legalName;  //开票人
                }
              }
            }
          }
        }else{
          this.$message.warning(res.message);
        }
      })
    },
    //选择发票方信息
    handlePartyChange(value,option){
      if (value){
        let data = cloneObject(option.data.attrs.partyData);
        this.form.taxBankName = data.taxBankName;  //开户行
        this.form.taxPhone = data.taxPhone;  //电话
        this.form.taxBankAccount = data.taxBankAccount;  //账号
      }
    },
    //获取购买方信息
    getDraweeList(){
      let entId = this.id;
      getReceiveList(entId).then(res => {
        if (res.success) {
          if (res.result){
            this.receiverList = res.result;
          }
        }else{
          this.$message.warning(res.message);
        }
      })
    },
    //选择购买方信息
    handleReceiverChange(value,option){
      if (value){
        let data = cloneObject(option.data.attrs.receiverData);
        this.form.entName = data.entName;  //企业名称
        this.form.entCreditCode = data.entCreditCode;  //税号
        this.form.entAddress = data.entAddress;  //公司地址
        this.form.entPhone = data.entPhone;  //电话
        this.form.entBankName = data.entBankName;  //开户行
        this.form.entBankAccount = data.entBankAccount;  //账号
        this.form.collectionUser = data.collectionUser;  //收款人
        this.form.reviewUser = data.reviewUser;  //复核人
        this.form.invoiceUser = data.invoiceUser;  //开票人
      }
    },
    //查询收件信息
    getReceivingList(){
      let entId = this.id;
      getMailList(entId).then(res => {
        if (res.success) {
          if (res.result){
            this.mailList = res.result;
          }
        }else{
          this.$message.warning(res.message);
        }
      })
    },
    //选择邮寄信息
    handleMailChange(value,option){
      // console.log(option.data.attrs)
      if (value){
        let data = cloneObject(option.data.attrs.mailData);
        this.form.mailUserAddress = data.mailUserAddress;
        this.form.mailUserName = data.mailUserName;
        this.form.mailUserPhone = data.mailUserPhone;
      }
    },
    //  ---------------------------- 校验规则 ↓ -------------------------------
    // methods 正则替换小数点
    limitNumber(value){
      return limitDigits(value);
    },
    //分转元
    scalerPrice(money){
      return conversionElement(money);
    },
    //百分比转换    0.6 => 60%
    scalerSign(num){
      return percentConversion(num);
    },
  }
}
</script>

<style scoped lang="less">
.main_content{
  color: @color-smudge;
}
.title_header{
  display: flex;
  align-items: center;
  margin: 0 0 10px;
  h3{
    margin-right: 20px;
    margin-bottom: 0;
  }
}
h3{
  font-weight: bolder;
}

.invoice_header{
  width: 100%;
  padding: 10px 24px;
  margin-bottom: 10px;
  background: #FFFFFF;
  display: flex;
  justify-content: space-between;
  align-items: center;
  .surplus{
    color: @color-lightGary;
  }
}
.invoice_left{
  width: 100%;
  display: flex;
  align-items: center;
  margin-bottom: 10px;

  .ant-input{
    min-width: 200px;
    margin-left: 10px;
  }
  /deep/.ant-select-selection--single{
    width: 150px;
  }
  /deep/.ant-input-number-input{
    width: 200px;
  }

  .tips{
    margin-left: 20px;
    font-size: 14px;
    white-space: nowrap;
    color: @color-lightGary;
  }
}



.preview{
  display: flex;
  align-items: flex-start;
  .imgEle{
    margin-left: 20px;
    width: 600px;
    height: 300px;
    img{
      width: 100%;
      height: 100%;
      vertical-align: middle;
    }
  }
}
//预估费用
.estimated{
  width: 100%;
  h5{
    font-weight: bolder;
    font-size: 16px;
  }
}

//提交成功
/deep/.ant-result-success .ant-result-icon > .anticon{
  color: @color-blue;
}


//弹层公共样式
.desc_name{
  color: #101010;
}
.desc_explain{
  width: 100%;
  padding: 0 10px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.desc_footer{
  width: 100%;
  padding: 5px 10px;
  //background: #F9F8F9;
  //border: 1px solid #dee0e2;
  //border-radius: 10px;
  margin-bottom: 20px;
  p{
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
  }
  .price{
    color: @color-blue;
  }
}
.desc_btn{
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: flex-end;
  margin: 40px 0 20px 0;
  text-align: center;
}
.desc_btn a{
  margin-left: 10px;
  //text-decoration: underline;
}


//金额超限
.exceedLimit{
  width: 100%;
  padding: 20px 10px;
  color: #101010;
  h4{
    display: flex;
    align-items: center;
    font-weight: bolder;
    font-size: 20px;
    padding-left: 30px;
    margin-bottom: 20px;
    i{
      color: @color-orange;
      font-size: 50px;
      margin-right: 10px;
    }
  }
  .describe{
    margin-bottom: 20px;
    padding-left: 40px;
    font-size: 18px;
    line-height: 30px;
  }
}

//选择核定方式
.methodVerification{
  h4{
    display: flex;
    align-items: flex-start;
    font-weight: bolder;
    font-size: 20px;
    padding-left: 30px;
    margin-bottom: 20px;
    i{
      color: @color-orange;
      font-size: 50px;
      margin-right: 10px;
    }
  }
  .ratify{
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    border: 1px solid #dee0e2;
    color: #101010;
    .ratify_item{
      width: 100%;
      display: flex;
      align-items: center;
      .item{
        text-align: center;
        height: 100%;
        padding: 5px 0;
        display: inline-block;
      }
      .item_one{width: 50px;display: flex;align-items: center;justify-content: center;}
      .item_two{
        flex: 2;
        display: flex;
        justify-content: center;
        flex-wrap: wrap;
        align-items: center;
        span{
          width: 100%;
        }
        .sell{
          width: 60px;
          background: @color-blue;
          font-size: 14px;
          border-radius: 20px;
          line-height: 28px;
          color: #FFFFFF;
          display: block;
        }
        .middle_tax{
          margin-top: 10px;
          width: 100%;
          text-align: center;
          color: @color-blue;
        }
      }
      .item_three{flex: 3;padding-left: 10px;}
      .desc{
        width: 100%;
        text-align: left;
        box-sizing: border-box;
        padding-top: 20px;
        span{
          display: block;
        }
      }
      .item_one,.item_two{
        border-right: 1px solid #dee0e2;
      }
    }
    .ratify_item:nth-child(1){
      background: #F8F8F8;
      border-bottom: 1px solid #dee0e2;
      font-weight: bolder;
    }
    .ratify_item:nth-child(2){
      border-bottom: 1px solid #dee0e2;
      //border: 2px solid @color-green;
      background: #eef1fd;
    }
  }
  .tips{
    width: 100%;
    //text-align: center;
    margin-top: 10px;
    margin-left: 5px;
    color: @color-lightGary;
    //font-weight: bolder;
  }



}
.blue{
  color: @color-blue;
}

//资料补充
.supplement{
  width: 100%;
  h4{
    display: flex;
    align-items: center;
    font-weight: bolder;
    padding-left: 30px;
    margin-bottom: 20px;
    p{
      font-size: 18px;
      margin-bottom: 0;
    }
    i{
      color: @color-orange;
      font-size: 50px;
      margin-right: 10px;
    }
  }
  .byte{
    display: inline-block;
    color: @color-blue;
  }

  .item_content{
    width: 100%;
    padding: 10px 23px;
    border-radius: 10px;
    border: 1px solid rgba(187, 187, 187, 1);
    margin-top: 20px;

    .item_header{
      width: 100%;
      display: flex;
      justify-content: space-between;
      align-items: center;
    }
    .item_bottom{
      width: 100%;
      padding-top: 20px;
    }
  }

  .active{
    //border: 1px solid #4266E5;
  }
  .afterborder{
    border: 1px solid #4266E5;
    background: rgba(233,243,255,.6);
  }
}

//生成业务
.business{
  h4{
    display: flex;
    align-items: center;
    font-weight: bolder;
    font-size: 20px;
    padding-left: 30px;
    margin-bottom: 20px;
    i{
      color: @color-blue;
      font-size: 50px;
      margin-right: 10px;
    }
  }

  .business_item{
    width: 100%;
    //background: #F9F8F9;
    border-bottom: 1px solid #dee0e2;
    //border-radius: 10px;
    padding: 20px 10px;
    //margin-top: 20px;
    color: #101010;
    h6{
      color: #101010;
      font-weight: bolder;
      font-size: 14px;
      margin-bottom: 20px;
    }
    .business_name{
      display: inline-block;
      width: 100px;
      text-align: right;
      font-size: 14px;
      color: #999999;
      //font-weight: bolder;
    }
    .last_item{
      margin-bottom: 0;
    }
    .business_btn{
      margin-bottom: 5px;
      width: 100%;
      text-align: right;
    }
  }
}


/deep/.imgType .ant-col-6{
  width: 100px;
}
/deep/.bill > .ant-row{
  display: flex;
  flex-wrap: wrap;
}

/deep/.one-layout{
  margin-top: 30px;
  .ant-col-6{
    width: 10%;
  }
  .ant-col-14{
    width: 20%;
  }
}
/deep/.two-layout{
  margin-top: 30px;
  .ant-col-6{
    width: 10%;
  }
}

.remarks{
  color: #101010;
}
.invoiceReceive{
  width: 100%;
  padding-left: 30px;
  h4{
    font-weight: bolder;
    font-size: 20px;
    margin-bottom: 20px;
  }
  p{
    color: @color-smudge;
    font-size: 16px;
    span{
      font-weight: bolder;
    }
  }
}

</style>
